<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ include file="headimport.jsp" %>
<script src="js/jquery-3.3.1.js"></script>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用户登录</title>
		
		</head>
		<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.min.css" />
		<script type="text/javascript" src="bootstrap-3.3.7-dist/js/bootstrap.min.js" ></script>
		<link rel="stylesheet" href="css/login.css" />
	
	<body>
		<div id="carven">
        <div id="main">
        	<p id="topic" colspan="4">用 户 登 录</p>
        	
        	
    	<form method="post" name="loginform" action = "">
    		<div id="login">
    	<table>
        	<tr>
            	<td width="20%" id="title">用户名：</td>
            	<td width="7%" id="photo"><img src="img/user.png" width="22px" height="22px"/></td>
                <td  colspan="2" id="input"><input class="input1" name="userid" type="text" /></td>
           
            </tr>
            <tr>
            	<td id="title">密码：</td>
                <td id="photo"><img src="img/pwd.png" width="22px" height="22px"/></td>
                <td colspan="2" id="input"><input class="input1" name="pwd" type="password" /></td>
            </tr>
			<tr>
            	<td id="title">验证码：</td>
                <td id="photo"><img src="img/varify.png" width="22px" height="22px"/></td>
                <td id="input"><input  class="input2" name="varify" type="text" size="10" height="24px" />
                </td>
                <td id="varify"> 
                <img src="safecode.do" width="90px" height="28px"/>
                </td>
            </tr>
            <tr>
            	<td colspan="4" style="text-align:center" id="usertype">
            		
            		<input type="radio" value="1" id="male" name="usertype" /><label for="male">学生</label>
            		<input type="radio" value="2" name="usertype" /><label for="male">教师
            		<input type="radio" value="3" name="usertype" /><label for="male">管理员
            	</td>
            </tr>	
			<tr>
            	<td colspan="4" style="text-align:center" id="loginbtn">
                
                	<input class = "btn" name="login" type="submit" value="登录" />
                    <input class = "btn" name="reset" type="reset" value="重置" />
                    
                </td>
            </tr>
            
        </table>
        </div>
    	</form>
    	<script>
    		$(function(){
				$("input").click(function(){
					var a=$("input[name='usertype']:checked").val();
					if(a=="1"){
					document.all("loginform").setAttribute("action", "stulogin.action");
					}else if(a=="2"){
					document.all("loginform").setAttribute("action", "");
					}else{
					document.all("loginform").setAttribute("action", "adminlogin.action");
					}
				});
			});

    	</script>
    	</div>
    	
        </div>
        </div>
			<script type="text/javascript">
$(document).ready(
function () {
//判断显示器的分辨率
var winWidth = document.documentElement.clientWidth;
var winHeight = document.documentElement.clientheight;
//var main = document.getElementById("main");
var main1 = $("#main");
var topic = $("#topic");
var content = $("#content");
var footer = $("#footer");
//alert(main.style.width);
//alert(main1.width());
//main.style.width = (winWidth - 1024)/2 +760 +"px";
main1.css("width", (winWidth - 1024)/2 +760 +"px");
topic.css("width", (winWidth - 1024)/2 +760-22 +"px");
content.css("width", (winWidth - 1024)/2 +760 +"px");
footer.css("width", (winWidth - 1024)/2 +760 +"px");
}
);
</script>
	</body>

</html>
